Page({
  data: {
    FileUrl: '', // 下载文件地址
    FileName: '', // 下载文件名称
    downloadProgress: 0, // 下载进度百分比
    progressText: '等待下载', // 进度文本
    fileName: '示例文件.pdf', // 文件名
    downloadedSize: '0', // 已下载大小
    downloadSpeed: '0', // 下载速度
    isDownloading: false, // 是否正在下载
    statusText: '', // 状态文本

    downloadTask: null, // 下载任务对象
    lastUpdateTime: 0, // 最后更新时间(用于计算速度)
    lastLoaded: 0, // 上次已加载字节数
    tempFilePath: ''
  },

  onLoad: function (options) {
    const {
      url,
      name
    } = options;
    this.setData({
      FileUrl: decodeURIComponent(url),
      FileName: decodeURIComponent(name)
    });
    // 绘制初始环形进度条背景
    this.drawProgressBg();
    this.startDownload();
  },

  // 绘制进度条背景
  drawProgressBg: function () {
    const ctx = wx.createCanvasContext('canvasProgressBg', this); // 注意第二个参数 `this` 在自定义组件中是必须的
    const canvasWidth = 160; // 必须与WXSS中设置的width一致
    const canvasHeight = 160; // 必须与WXSS中设置的height一致
    const centerX = canvasWidth / 2;
    const centerY = canvasHeight / 2;
    const radius = (canvasWidth / 2) - 5; // 半径，考虑线宽留些空间

    ctx.setLineWidth(10);
    ctx.setStrokeStyle('#f0f0f0');
    ctx.setLineCap('round');
    ctx.beginPath();
    ctx.arc(centerX, centerY, radius, 0, 2 * Math.PI, false); // 使用计算出的圆心和半径
    ctx.stroke();
    ctx.draw(); // 确保调用draw
  },

  // 绘制进度条
  drawProgress: function (percent) {
    const ctx = wx.createCanvasContext('canvasProgress', this);
    const canvasWidth = 160; // 必须与WXSS中设置的width一致
    const canvasHeight = 160; // 必须与WXSS中设置的height一致
    const centerX = canvasWidth / 2;
    const centerY = canvasHeight / 2;
    const radius = (canvasWidth / 2) - 5; // 半径，考虑线宽留些空间

    const gradient = ctx.createLinearGradient(0, 0, canvasWidth, canvasHeight);
    gradient.addColorStop(0, '#007AFF');
    gradient.addColorStop(1, '#00C6FF');

    ctx.setLineWidth(8);
    ctx.setStrokeStyle(gradient);
    ctx.setLineCap('round');
    ctx.beginPath();
    // 从-90度开始，使0%位置在顶部
    ctx.arc(centerX, centerY, radius, -0.5 * Math.PI, (percent / 100) * 2 * Math.PI - 0.5 * Math.PI, false);
    ctx.stroke();
    ctx.draw();
  },

  // 开始下载文件
  startDownload: function () {
    console.log(this.data.FileUrl);
    if (this.data.isDownloading) return;

    this.setData({
      isDownloading: true,
      statusText: '正在连接...',
      downloadProgress: 0,
      downloadedSize: '0'
    });

    this.drawProgress(0);

    // 创建下载任务
    this.data.downloadTask = wx.downloadFile({
      url: this.data.FileUrl,
      success: (res) => {
        if (res.statusCode === 200) {
          this.setData({
            statusText: '下载完成',
            progressText: '下载完成',
            isDownloading: false,
          });
          wx.saveFile({
            tempFilePath: res.tempFilePath,
            success: (saveRes) => {
              const savedFilePath = saveRes.savedFilePath;
              this.setData({
                tempFilePath: savedFilePath
              });
              wx.showToast({
                title: `已保存至手机${savedFilePath}`,
                icon: 'none',
                duration: 3000
              });
            },
            fail: (err) => {
              console.error('保存失败：', err);
              wx.showToast({
                title: '保存失败',
                icon: 'none'
              });
            }
          });
          // 文件下载成功，可以进行打开或保存操作
          // this.previewFile(res.tempFilePath);
        } else {
          this.setData({
            statusText: '下载失败: HTTP ' + res.statusCode,
            progressText: '下载失败',
            isDownloading: false
          });
        }
      },
      fail: (err) => {
        console.error('下载失败:', err);
        this.setData({
          statusText: '下载失败',
          progressText: '下载失败',
          isDownloading: false
        });
      }
    });

    // 监听下载进度更新[2](@ref)
    this.data.downloadTask.onProgressUpdate((res) => {
      this.updateProgress(res);
    });

    this.setData({
      lastUpdateTime: Date.now(),
      lastLoaded: 0
    });
  },

  // 更新进度显示
  updateProgress: function (res) {
    const currentTime = Date.now();
    const timeDiff = (currentTime - this.data.lastUpdateTime) / 1000; // 秒
    const loadedDiff = res.totalBytesWritten - this.data.lastLoaded;

    // 计算下载速度 (KB/s)
    let speed = timeDiff > 0 ? (loadedDiff / 1024 / timeDiff).toFixed(1) : '0';

    this.setData({
      downloadProgress: res.progress,
      downloadedSize: (res.totalBytesWritten / 1024 / 1024).toFixed(2),
      downloadSpeed: speed,
      lastUpdateTime: currentTime,
      lastLoaded: res.totalBytesWritten
    });

    // 更新进度文本
    let progressText = '下载中...';
    if (res.progress === 100) {
      progressText = '下载完成';
    }
    // else if (res.progress < 10) {
    //   progressText = '开始下载...';
    // } else if (res.progress < 50) {
    //   progressText = '下载中...';
    // } else if (res.progress < 80) {
    //   progressText = '即将完成...';
    // }

    this.setData({
      progressText: progressText,
      statusText: `已下载 ${res.progress}%`
    });

    // 更新环形进度条
    this.drawProgress(res.progress);
  },

  // 取消下载
  cancelDownload: function () {
    if (this.data.downloadTask) {
      this.data.downloadTask.abort();
      this.setData({
        isDownloading: false,
        statusText: '下载已取消',
        progressText: '已取消'
      });
    }
  },

  // 预览下载的文件
  previewFile: function () {
    wx.openDocument({
      filePath: this.data.tempFilePath,
      showMenu: true,
      success: function (res) {
        console.log('打开文档成功');
      },
      fail: function (err) {
        console.error('打开文档失败:', err);
        wx.showToast({
          title: '文件打开失败',
          icon: 'none'
        });
      }
    });
  },

  // 返回按钮点击事件
  navigateBack: function () {
    // 检查页面栈决定返回方式
    const pages = getCurrentPages();
    if (pages.length > 1) {
      wx.navigateBack({
        delta: 1
      });
    } else {
      // 如果是首页，则跳转到指定页面
      wx.switchTab({
        url: '/pages/index/index'
      });
    }
  },

  onUnload: function () {
    // 页面卸载时取消下载任务
    if (this.data.downloadTask && this.data.isDownloading) {
      this.data.downloadTask.abort();
    }
  }
});